import React from 'react';
import logo from './Res/logo_white.png';
import slogon from './Res/qrcode.png';
import mute from './Res/mute.png';
import ios_download from './Res/ios_download.png';
import home_ad from "./Res/home_ad.mp4";
import android_download from './Res/android_download.png';
import './App.css';

import {Link} from 'react-router-dom';

function App() {
  return (
    <div className="App">
      <div class="VideoBg">
        <video muted data-autoplay loop="loop" autoplay="autoplay" src={home_ad} class="video-tvc" id="video-tvc" data-object-fit="">抱歉，您的浏览器不支持内嵌视频</video>
      </div>
      <div class="Content">
        <header className="HeaderContainer">
          <div className="LogoContainer">
            <img class="Logo" src={logo} alt="logo"></img>
          </div>
          <div class="MenuContainer">
            <ul class="Menu">
              <li><Link to="/">首页</Link></li>
              <li><Link to="/join">合作入驻</Link></li>
              <li>企业合作</li>
              <li>关于我们</li>
              <li><img alt="mute" src={mute} className="MuteBtn"/></li>
            </ul>
          </div>
        </header>
        <article>
          <aside className="Middle">
            <div className="DownloadContainer">
              <div className="Download">
                <img alt='ios' src={ios_download}></img>
                <img alt='ios' src={android_download}></img>
              </div>
              <img src={slogon} alt="slogon" className="QrCode"></img>
            </div>
            <p>农心海祝</p>
            <p>食材鲜,食才鲜</p>
          </aside>
        </article>
        <footer></footer>
      </div>
    </div>
  );
}

export default App;
